<template>
  <div class="p-12 text-center">
    <img
      class="w-40 h-40 rounded-1 mr-4"
      src="../assets/img/avatar1.png"
      alt=""
      srcset=""
    />
    <h1 class="text-5xl m-8">账号名称</h1>
    <van-button type="warning" plain to="/setting">编辑资料</van-button>
  </div>
  <van-cell-group>
    <van-cell title="我的收藏" v-for="_ in 6" is-link></van-cell>
  </van-cell-group>
  <div class="p-12">
    <van-button type="danger" block @click="handleLogout">退出登录</van-button>
  </div>
</template>

<script setup lang="ts">
import { useAccount } from "../store/user";
import { useRouter } from "vue-router";
const user = useAccount();
const router = useRouter(); //此处的router，等同于vue2中使用的this.$router
const handleLogout = () => {
  user.userInfo = null;
  router.push("/home");
};
</script>

<style scoped></style>
